<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>回复评论</title>
  <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
</head>
<body style="margin: 0px;padding: 0px;background-color: #f1f1f1;">
    <div class="row" style="padding: 0px 0px ;margin: 0px 0px;">
      <div class="col-md-12" style="padding: 0px 0px ;margin: 0px 0px;">
        <h2 class="sub-header" style="text-align: center; margin: 0px 0px; background-color: #c1cec1; height: 58px; ">
          填写内容
        </h2>
      </div>
    </div>
    <div class="row" style="padding: 0px 0px ;margin: 0px 0px;">
      <div class="col-md-2" ></div>
      <div class="col-md-8" style="background-color: white;">
        <article class="markdown-body">
          <h1 id="_1"><a name="user-content-_1" href="" class="headeranchor-link" aria-hidden="true"><span
                class="headeranchor"></span></a>{{topic.title}}</h1>
          <div >
            <h4><a name="user-content-_2" href="" class="headeranchor-link" aria-hidden="true">{{topic.publisher}}</a>
            </h4>
            <a href="">粉丝</a> <span style="color: red;">{{quser.fans}}</span><br>
            <!-- <a href="javascript:void(0)" id="getfan">+关注</a> -->
            
            {{ if fanStage.length === 0}}
            <button type="button" id="getfan">关注</button>
            {{ else }}
            <button type="button" id="losefan" >取消关注</button>
            {{ /if }}
          </div>
          <p>内容：{{topic.content}}</p>
        </article>
        {{ each comments comment index }}
        <div class="panel panel-default">
          <div class="panel-heading">
            <b>
              <span style="font-size: 1.25rem;">{{comment.from_nickname}}</span>
            </b> 评论
            <span >
              <a  type="button" style="color: green;width: 20px; overflow: hidden;height: 22px;" onclick="supportFuc(this, 1)">
                <input type="text"  name="commentInputValue" value="{{comment.id}}" style="display: none;">
                <input type="text"  name="commentInputValue" value="{{supportStage}}" style="display: none;">
                <input type="text"  name="commentInputValue" value="{{user._id}}" style="display: none;">

                {{ if supportStage.length !== 0}}
                  {{ each supportStage supportData  i }}
                    {{ if  supportData.comment_id == comment.id  }}
                      {{ if  supportData.support_id == user._id}}
                        {{ if   supportData.mark_support !== 1 }}
                        <!-- 一(空) -->
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
                          <path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z"/>
                        </svg>
                        {{ else if supportData.mark_support === 1 }}
                        <!-- 二(满) -->
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up-fill" viewBox="0 0 16 16">
                          <path d="M6.956 1.745C7.021.81 7.908.087 8.864.325l.261.066c.463.116.874.456 1.012.964.22.817.533 2.512.062 4.51a9.84 9.84 0 0 1 .443-.05c.713-.065 1.669-.072 2.516.21.518.173.994.68 1.2 1.273.184.532.16 1.162-.234 1.733.058.119.103.242.138.363.077.27.113.567.113.856 0 .289-.036.586-.113.856-.039.135-.09.273-.16.404.169.387.107.819-.003 1.148a3.162 3.162 0 0 1-.488.9c.054.153.076.313.076.465 0 .306-.089.626-.253.912C13.1 15.522 12.437 16 11.5 16H8c-.605 0-1.07-.081-1.466-.218a4.826 4.826 0 0 1-.97-.484l-.048-.03c-.504-.307-.999-.609-2.068-.722C2.682 14.464 2 13.846 2 13V9c0-.85.685-1.432 1.357-1.616.849-.231 1.574-.786 2.132-1.41.56-.626.914-1.279 1.039-1.638.199-.575.356-1.54.428-2.59z"/>
                        </svg>
                        {{ /if }}
                      {{ else }}
                      <!-- 三内san(空) -->
                      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
                        <path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z"/>
                      </svg>
                      {{ /if }}
                    {{ else if supportData == supportStage[supportStage.length -1] }}
                      
                     
                      <!-- 三内aaa(空) -->
                      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
                        <path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z"/>
                      </svg>
                      
                    
                    {{ /if }}
                  {{ /each }}
                {{ else }}
                  <!-- 三外(空) -->
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
                    <path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z"/>
                  </svg>
                {{ /if }}
              </a>
            </span>
            <span class="action">
                {{ comment.like }}
            </span>
            <span>
              <a   type="button" style="color: red; width: 20px; overflow: hidden;height: 22px;"  onclick="supportFuc(this, 0)">
                <input type="text"  name="commentInputValue" value="{{comment.id}}" style="display: none;">
                <input type="text"  name="commentInputValue" value="{{supportStage}}" style="display: none;">
                <input type="text"  name="commentInputValue" value="{{user._id}}" style="display: none;">
                {{ if supportStage.length !== 0}}
                  {{ each supportStage supportData  i }}
                    {{ if  supportData.comment_id == comment.id  }}
                      {{ if  supportData.support_id == user._id}}
                        {{ if   supportData.mark_noSupport === 1 }}
                          <!-- 四(满) -->
                          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-down-fill" viewBox="0 0 16 16">
                            <path d="M6.956 14.534c.065.936.952 1.659 1.908 1.42l.261-.065a1.378 1.378 0 0 0 1.012-.965c.22-.816.533-2.512.062-4.51.136.02.285.037.443.051.713.065 1.669.071 2.516-.211.518-.173.994-.68 1.2-1.272a1.896 1.896 0 0 0-.234-1.734c.058-.118.103-.242.138-.362.077-.27.113-.568.113-.856 0-.29-.036-.586-.113-.857a2.094 2.094 0 0 0-.16-.403c.169-.387.107-.82-.003-1.149a3.162 3.162 0 0 0-.488-.9c.054-.153.076-.313.076-.465a1.86 1.86 0 0 0-.253-.912C13.1.757 12.437.28 11.5.28H8c-.605 0-1.07.08-1.466.217a4.823 4.823 0 0 0-.97.485l-.048.029c-.504.308-.999.61-2.068.723C2.682 1.815 2 2.434 2 3.279v4c0 .851.685 1.433 1.357 1.616.849.232 1.574.787 2.132 1.41.56.626.914 1.28 1.039 1.638.199.575.356 1.54.428 2.591z"/>
                          </svg>
                        {{ else if supportData.mark_noSupport !== 1 }}
                          <!-- 五(空) -->
                          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-down" viewBox="0 0 16 16">
                            <path d="M8.864 15.674c-.956.24-1.843-.484-1.908-1.42-.072-1.05-.23-2.015-.428-2.59-.125-.36-.479-1.012-1.04-1.638-.557-.624-1.282-1.179-2.131-1.41C2.685 8.432 2 7.85 2 7V3c0-.845.682-1.464 1.448-1.546 1.07-.113 1.564-.415 2.068-.723l.048-.029c.272-.166.578-.349.97-.484C6.931.08 7.395 0 8 0h3.5c.937 0 1.599.478 1.934 1.064.164.287.254.607.254.913 0 .152-.023.312-.077.464.201.262.38.577.488.9.11.33.172.762.004 1.15.069.13.12.268.159.403.077.27.113.567.113.856 0 .289-.036.586-.113.856-.035.12-.08.244-.138.363.394.571.418 1.2.234 1.733-.206.592-.682 1.1-1.2 1.272-.847.283-1.803.276-2.516.211a9.877 9.877 0 0 1-.443-.05 9.364 9.364 0 0 1-.062 4.51c-.138.508-.55.848-1.012.964l-.261.065zM11.5 1H8c-.51 0-.863.068-1.14.163-.281.097-.506.229-.776.393l-.04.025c-.555.338-1.198.73-2.49.868-.333.035-.554.29-.554.55V7c0 .255.226.543.62.65 1.095.3 1.977.997 2.614 1.709.635.71 1.064 1.475 1.238 1.977.243.7.407 1.768.482 2.85.025.362.36.595.667.518l.262-.065c.16-.04.258-.144.288-.255a8.34 8.34 0 0 0-.145-4.726.5.5 0 0 1 .595-.643h.003l.014.004.058.013a8.912 8.912 0 0 0 1.036.157c.663.06 1.457.054 2.11-.163.175-.059.45-.301.57-.651.107-.308.087-.67-.266-1.021L12.793 7l.353-.354c.043-.042.105-.14.154-.315.048-.167.075-.37.075-.581 0-.211-.027-.414-.075-.581-.05-.174-.111-.273-.154-.315l-.353-.354.353-.354c.047-.047.109-.176.005-.488a2.224 2.224 0 0 0-.505-.804l-.353-.354.353-.354c.006-.005.041-.05.041-.17a.866.866 0 0 0-.121-.415C12.4 1.272 12.063 1 11.5 1z"/>
                          </svg>
                        {{ /if }}
                      {{ else }}
                      <!-- 六内(空) -->
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-down" viewBox="0 0 16 16">
                          <path d="M8.864 15.674c-.956.24-1.843-.484-1.908-1.42-.072-1.05-.23-2.015-.428-2.59-.125-.36-.479-1.012-1.04-1.638-.557-.624-1.282-1.179-2.131-1.41C2.685 8.432 2 7.85 2 7V3c0-.845.682-1.464 1.448-1.546 1.07-.113 1.564-.415 2.068-.723l.048-.029c.272-.166.578-.349.97-.484C6.931.08 7.395 0 8 0h3.5c.937 0 1.599.478 1.934 1.064.164.287.254.607.254.913 0 .152-.023.312-.077.464.201.262.38.577.488.9.11.33.172.762.004 1.15.069.13.12.268.159.403.077.27.113.567.113.856 0 .289-.036.586-.113.856-.035.12-.08.244-.138.363.394.571.418 1.2.234 1.733-.206.592-.682 1.1-1.2 1.272-.847.283-1.803.276-2.516.211a9.877 9.877 0 0 1-.443-.05 9.364 9.364 0 0 1-.062 4.51c-.138.508-.55.848-1.012.964l-.261.065zM11.5 1H8c-.51 0-.863.068-1.14.163-.281.097-.506.229-.776.393l-.04.025c-.555.338-1.198.73-2.49.868-.333.035-.554.29-.554.55V7c0 .255.226.543.62.65 1.095.3 1.977.997 2.614 1.709.635.71 1.064 1.475 1.238 1.977.243.7.407 1.768.482 2.85.025.362.36.595.667.518l.262-.065c.16-.04.258-.144.288-.255a8.34 8.34 0 0 0-.145-4.726.5.5 0 0 1 .595-.643h.003l.014.004.058.013a8.912 8.912 0 0 0 1.036.157c.663.06 1.457.054 2.11-.163.175-.059.45-.301.57-.651.107-.308.087-.67-.266-1.021L12.793 7l.353-.354c.043-.042.105-.14.154-.315.048-.167.075-.37.075-.581 0-.211-.027-.414-.075-.581-.05-.174-.111-.273-.154-.315l-.353-.354.353-.354c.047-.047.109-.176.005-.488a2.224 2.224 0 0 0-.505-.804l-.353-.354.353-.354c.006-.005.041-.05.041-.17a.866.866 0 0 0-.121-.415C12.4 1.272 12.063 1 11.5 1z"/>
                        </svg>
                      {{ /if }}
                    {{ else if supportData == supportStage[supportStage.length -1] }}
                      
                     
                      <!-- 六内(空) -->
                      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-down" viewBox="0 0 16 16">
                        <path d="M8.864 15.674c-.956.24-1.843-.484-1.908-1.42-.072-1.05-.23-2.015-.428-2.59-.125-.36-.479-1.012-1.04-1.638-.557-.624-1.282-1.179-2.131-1.41C2.685 8.432 2 7.85 2 7V3c0-.845.682-1.464 1.448-1.546 1.07-.113 1.564-.415 2.068-.723l.048-.029c.272-.166.578-.349.97-.484C6.931.08 7.395 0 8 0h3.5c.937 0 1.599.478 1.934 1.064.164.287.254.607.254.913 0 .152-.023.312-.077.464.201.262.38.577.488.9.11.33.172.762.004 1.15.069.13.12.268.159.403.077.27.113.567.113.856 0 .289-.036.586-.113.856-.035.12-.08.244-.138.363.394.571.418 1.2.234 1.733-.206.592-.682 1.1-1.2 1.272-.847.283-1.803.276-2.516.211a9.877 9.877 0 0 1-.443-.05 9.364 9.364 0 0 1-.062 4.51c-.138.508-.55.848-1.012.964l-.261.065zM11.5 1H8c-.51 0-.863.068-1.14.163-.281.097-.506.229-.776.393l-.04.025c-.555.338-1.198.73-2.49.868-.333.035-.554.29-.554.55V7c0 .255.226.543.62.65 1.095.3 1.977.997 2.614 1.709.635.71 1.064 1.475 1.238 1.977.243.7.407 1.768.482 2.85.025.362.36.595.667.518l.262-.065c.16-.04.258-.144.288-.255a8.34 8.34 0 0 0-.145-4.726.5.5 0 0 1 .595-.643h.003l.014.004.058.013a8.912 8.912 0 0 0 1.036.157c.663.06 1.457.054 2.11-.163.175-.059.45-.301.57-.651.107-.308.087-.67-.266-1.021L12.793 7l.353-.354c.043-.042.105-.14.154-.315.048-.167.075-.37.075-.581 0-.211-.027-.414-.075-.581-.05-.174-.111-.273-.154-.315l-.353-.354.353-.354c.047-.047.109-.176.005-.488a2.224 2.224 0 0 0-.505-.804l-.353-.354.353-.354c.006-.005.041-.05.041-.17a.866.866 0 0 0-.121-.415C12.4 1.272 12.063 1 11.5 1z"/>
                      </svg>
                    
                    {{ /if }}
                  {{ /each }}
                {{ else }}
                  <!-- 六外(空) -->
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-down" viewBox="0 0 16 16">
                    <path d="M8.864 15.674c-.956.24-1.843-.484-1.908-1.42-.072-1.05-.23-2.015-.428-2.59-.125-.36-.479-1.012-1.04-1.638-.557-.624-1.282-1.179-2.131-1.41C2.685 8.432 2 7.85 2 7V3c0-.845.682-1.464 1.448-1.546 1.07-.113 1.564-.415 2.068-.723l.048-.029c.272-.166.578-.349.97-.484C6.931.08 7.395 0 8 0h3.5c.937 0 1.599.478 1.934 1.064.164.287.254.607.254.913 0 .152-.023.312-.077.464.201.262.38.577.488.9.11.33.172.762.004 1.15.069.13.12.268.159.403.077.27.113.567.113.856 0 .289-.036.586-.113.856-.035.12-.08.244-.138.363.394.571.418 1.2.234 1.733-.206.592-.682 1.1-1.2 1.272-.847.283-1.803.276-2.516.211a9.877 9.877 0 0 1-.443-.05 9.364 9.364 0 0 1-.062 4.51c-.138.508-.55.848-1.012.964l-.261.065zM11.5 1H8c-.51 0-.863.068-1.14.163-.281.097-.506.229-.776.393l-.04.025c-.555.338-1.198.73-2.49.868-.333.035-.554.29-.554.55V7c0 .255.226.543.62.65 1.095.3 1.977.997 2.614 1.709.635.71 1.064 1.475 1.238 1.977.243.7.407 1.768.482 2.85.025.362.36.595.667.518l.262-.065c.16-.04.258-.144.288-.255a8.34 8.34 0 0 0-.145-4.726.5.5 0 0 1 .595-.643h.003l.014.004.058.013a8.912 8.912 0 0 0 1.036.157c.663.06 1.457.054 2.11-.163.175-.059.45-.301.57-.651.107-.308.087-.67-.266-1.021L12.793 7l.353-.354c.043-.042.105-.14.154-.315.048-.167.075-.37.075-.581 0-.211-.027-.414-.075-.581-.05-.174-.111-.273-.154-.315l-.353-.354.353-.354c.047-.047.109-.176.005-.488a2.224 2.224 0 0 0-.505-.804l-.353-.354.353-.354c.006-.005.041-.05.041-.17a.866.866 0 0 0-.121-.415C12.4 1.272 12.063 1 11.5 1z"/>
                  </svg>
                {{ /if }}
               
              </a>
            </span>
            
            <div class="media-content" >
              <sapn style="position: absolute; right: 20%;">{{comment.createtime}}</sapn>
            </div>
          </div>
          <div class="panel-body" style="border: 1px solid #f1f1f1; position: relative;">
            {{ comment.content }}
            {{ if user._id === comment.from_id}}
            <div style="display: inline;position: absolute;right: 20px;">
              <a href="#" onclick="changeComment(this)">修改
                <input type="text"  name="commentInputValue" value="{{comment.content}}" style="display: none;">
                <input type="text"  name="commentInputValue" value="{{comment.id}}" style="display: none;">
              </a>
              <a href="#"  onclick="delectComent(this)">删除
                <input type="text"  name="commentInputValue" value="{{comment.id}}" style="display: none;">
              </a>
            </div>
            {{ /if }}
          </div>
          {{ each commentAnswer commentAnswerItem}}
            {{ if commentAnswerItem.comment_id == comment.id}}
            <div>
              <span style="color: #0056b3;">
                {{ commentAnswerItem.comment_answer_nickname }}
              </span>
              回复：
              <span>
                {{ commentAnswerItem.answer_content }}
              </span>
              <sapn style="position: absolute; right: 20%;">
                {{commentAnswerItem.comment_answer_createtime}}
              </sapn>
              {{ if user._id === commentAnswerItem.comment_answer_id}}
                <div style="display: inline;position: absolute;right: 35px;">
                  <a href="#" onclick="changeAnswer(this)">修改
                    <input type="text"  name="commentInputValue" value="{{commentAnswerItem.answer_content}}" style="display: none;">
                    <input type="text"  name="commentInputValue" value="{{commentAnswerItem.id}}" style="display: none;">
                  </a>
                  <a href="#"  onclick="delectAnswer(this)">删除
                    <input type="text"  name="commentInputValue" value="{{commentAnswerItem.id}}" style="display: none;">
                  </a>
                </div>
              {{ else if  user._id === commentAnswerItem.comment_pulisher_id}}
                <div style="display: inline;position: absolute;right: 35px;">
                  <a href="#"  onclick="delectAnswer(this)">删除
                    <input type="text"  name="commentInputValue" value="{{commentAnswerItem.id}}" style="display: none;">
                  </a>
                </div>
              {{ /if }}
            </div>
            {{ /if }}
          {{ /each }}
          <div class="reply-body" style="margin-top: 10px;">
            <div id="answer_form">
              <textarea name="answer_content"  cols="50" rows="5"></textarea>
              
              <!-- <div class="form-group" style="display: none;"> -->
              <input type="text" name="comment_id" value="{{comment.id}}" readonly style="display: none;">
              <input type="text" name="comment_pulisher_id" value="{{comment.from_id}}" readonly style="display: none;">
              <input type="text" name="comment_answer_id" value="{{user._id}}" readonly style="display: none;">
              <input type="text" name="comment_answer_nickname" value="{{user.nickname}}" readonly style="display: none;">
              <input type="text" name="createtime" value="createtime" readonly style="display: none;">
              <input type="text" name="createtime" value="{{ comment.topic_id }}" readonly style="display: none;">

              <!-- </div> -->
              <a href="#"  type="button" onclick="answer(this)" >回复</a>
            </div>
          </div>
          <hr>
        </div>
        {{ /each }}
        
        <form id="comment_form" style="margin-bottom: 20px;">
          <div class="form-group">
            <label for="">添加回复</label>
            <textarea class="form-control" name="content" id="" cols="10" rows="10"></textarea>
          </div>
          <div class="form-group" style="display: none;">
            <label for="">评论人id</label>
            <input type="text" name="from_id" value="{{user._id}}">
          </div>
          <div class="form-group" style="display: none;">
            <label for="">评论人昵称</label>
            <input type="text" name="from_nickname" value="{{user.nickname}}">
          </div>
          <div class="form-group" style="display: none;">
            <label for="">文章id</label>
            <input type="text" name="topic_id" value="{{topic.id}}">
          </div>
          <div class="form-group" style="display: none;">
            <label for="">发表时间</label>
            <input type="text" name="createtime" value="getDate()"  id="createtime">
          </div>
          <button type="submit" class="btn btn-success">回复</button>
        </form>
      </div>
      <div class="col-md-2" ></div>
    </div>
      
  <script src="/node_modules/jquery/dist/jquery.js"></script>
  <script src="/node_modules/moment/moment.js"></script>
  <script>
    var nowDate = new Date();
    nowDate = moment(nowDate).format('YYYY-MM-DD HH:mm:ss');
    document.getElementById('createtime').value = nowDate;
    $('#comment_form').on('submit', function(e) {
      e.preventDefault();
      var formData = $(this).serialize();
      $.ajax({
        url: '/comment',
        dataType: 'json',
        type: 'post',
        async: true,
        data: formData,
        success: function(data) {
          var err_code = data.err_code;
          console.log(err_code);
          if(err_code === 0) {
            window.location.reload()
          }else {
            alert(data.message)
          }
        }
      })
    })
    $('#getfan').click(function(e) {
      $.ajax({
        url: '/getFuns',
        dataType: 'json',
        type: 'get',
        data: 'user_id={{topic.publisher_id}}&fan_id={{user._id}}',
        success: function(data) {
          var err_code = data.err_code;
          console.log(err_code);
          if(err_code === 0) {
            window.alert('关注成功!')
            window.location.reload();
          }
          if(err_code === 1) {
            window.alert('已经关注过了!')
          }
        }
      })
    })

    // 取消关注
    $('#losefan').click(function(e) {
      $.ajax({
        url: '/loseFuns',
        dataType: 'json',
        type: 'get',
        data: 'user_id={{topic.publisher_id}}&fan_id={{user._id}}',
        success: function(data) {
         console.log(data);
         if(data.err_code === 0) {
           alert('取消关注成功')
           location.reload();
         }else {
           console.log('取消关注失败');
         }
        }
      })
    })

    // 回复信息
    function answer(e) {
      console.log(e.parentNode.children[0].value);
      let textareaData = e.parentNode.children[0].value;
      let comment_id = e.parentNode.children[1].value;
      let comment_pulisher_id = e.parentNode.children[2].value;
      let comment_answer_id = e.parentNode.children[3].value;
      let comment_answer_nickname = e.parentNode.children[4].value;
      let comment_answer_createtime = e.parentNode.children[5].value  = nowDate;
      let topic_id = e.parentNode.children[6].value;
      if(textareaData == '') {
        alert('请输入文字');
        return
      }
      console.log(textareaData, comment_id);
      answerData = {
        'textareaData': textareaData, 
        'comment_id': comment_id,
        'comment_pulisher_id': comment_pulisher_id,
        'comment_answer_id': comment_answer_id,
        'comment_answer_nickname': comment_answer_nickname,
        'comment_answer_createtime': comment_answer_createtime,
        'topic_id': topic_id
      };
      $.ajax({
        url: '/answer',
        dataType: 'json',
        data: answerData,
        type: 'get',
        success: function(data) {
          console.log(data);
          if(data.err_code == 0) {
            console.log('回复信息成功');
            location.reload();
          }
        }
      })
    }


    
    function supportFuc(e, stage) {
      console.log(e, stage);
      // console.log(stage.input.value);
      // let a = stage
      let commentID = e.children[0].value;
      let supportStage = e.children[1].value;
      let userId = e.children[2].value;
      let result;
      console.log(commentID, supportStage, userId);
      
      console.log(result);

      // console.log(commentID);
      let supportData = {'comment_id': commentID , 'stage': stage};
      console.log(supportData);
      $.ajax({
        url: '/getSupport',
        dataType: 'json',
        type: 'get',
        data: supportData,
        success: function(data) {
          console.log(data);
          if(data.err_code == 0) { 
            // alert('qq')
            console.log('点赞成功');
            window.location.reload();
          }
        }
      })
    }


    // 修改评论
    function changeComment(e) {
      console.log('修改评论');
      let commentText = e.children[0].value;
      let comment_id = e.children[1].value;

      let result = prompt('请输入要修改的内容', commentText);
      if(!!result) {
        console.log('确定修改');
        let commentData = {'commentText': result,'comment_id': comment_id};
        $.ajax({
        url: '/changeComment',
        dataType: 'json',
        type: 'get',
        data: commentData,
        success: function(data) {
          console.log(data);
          if(data.err_code === 0) {
            // alert('修改评论内容成功!')
            // window.location.href = '/topics/show' // 因为首页需要传参进去才可以正常加载，所以在此处路由不行
            window.location.reload();
          }
        }
      })
      }else {
        console.log('请输入内容!');
      }
    }

    // 修改回复
    function changeAnswer(e) {
      let commentAnswerContent = e.children[0].value;
      let commentAnswerId = e.children[1].value;
      let result = prompt('请输入要修改的内容', commentAnswerContent);
      if(!!result) {
        console.log('确定修改');
        let commentData = {'commentAnswerContent': result,'commentAnswerId': commentAnswerId};
        $.ajax({
        url: '/changeAnswer',
        dataType: 'json',
        type: 'get',
        data: commentData,
        success: function(data) {
          console.log(data);
          if(data.err_code === 0) {
            // alert('修改评论内容成功!')
            // window.location.href = '/topics/show' // 因为首页需要传参进去才可以正常加载，所以在此处路由不行
            window.location.reload();
          }
        }
      })
      }else {
        console.log('请输入内容!');
      }
      
    }
    // 删除回复
    function delectAnswer(e) {
      console.log('删除');
      let confirmDelect = window.confirm('确定删除评论！')
      console.log(confirmDelect);
      let commentAnswerId = e.children[0].value;
      let commentData = {'commentAnswerId': commentAnswerId};
      if(confirmDelect) {
          $.ajax({
          url: '/delectAnswer',
          dataType: 'json',
          type: 'get',
          data: commentData,
          success: function(data) {
            console.log(data);
            if(data.err_code === 0) {
              // alert('此条评论删除成功！')
              location.reload();
            }
          }
        })
      }else {
        console.log('已经取消删除评论!');
      }
    }

    function delectComent(e) {
      console.log('删除');
      let confirmDelect = window.confirm('确定删除评论！')
      console.log(confirmDelect);
      let comment_id = e.children[0].value;
      let commentData = {'comment_id': comment_id};
      if(confirmDelect) {
          $.ajax({
          url: '/delectComment',
          dataType: 'json',
          type: 'get',
          data: commentData,
          success: function(data) {
            console.log(data);
            if(data.err_code === 0) {
              // alert('此条评论删除成功！')
              location.reload();
            }
          }
        })
      }else {
        console.log('已经取消删除评论!');
      }
    }


  </script>
</body>
</html>

